<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>仿京东最上方导航</title>
  <style>
	*{padding:0;margin:0;color:#666;}
	a{text-decoration:none;color:#666;}
	a:hover{color:#b20000;}
	ul{list-style:none;}
	.box{
		height:30px;
		line-height:30px;
		font-size:12px;
		background:#f1f1f1;
	}
	.wrap{
		width:1000px;
		margin:0 auto;
	}
	.reg{
		color:#b20000;
	}
	ul li.line{
		width:1px;
		height:12px;
		overflow:hidden;
		background:#ddd;
		padding:0;
	}
	a.tel{
		padding-left:20px;
		background:url(img/tel.png) no-repeat left 5px;
	}
	a.tel:hover{
		background-position:left -20px;
	}
	  ul li{
		  display: inline-block;
		  padding: 0 8px;
	  }
	  ul li a{
		  display: inline-block;
	  }
  </style>
 </head>
 <body>
	<div class="box">
		<div class="wrap">
			<ul>
				<li><a href="">你好，请登录</a>&emsp;<a href="" class="reg">免费注册</a></li>
				<li class="line"></li>
				<li><a href="">我的订单</a></li>
				<li class="line"></li>
				<li><a href="">我的京东</a></li>
				<li class="line"></li>
				<li><a href="">京东会员</a></li>
				<li class="line"></li>
				<li><a href="">企业采购</a></li>
				<li class="line"></li>
				<li><a href="" class="tel">手机京东</a></li>
				<li class="line"></li>
				<li><a href="">关注京东</a></li>
				<li class="line"></li>
				<li><a href="">客户服务</a></li>
				<li class="line"></li>
				<li><a href="">客户服务</a></li>
			</ul>
		</div>
	</div>
 </body>
</html>
